var gulp = require("gulp");
var babel = require("gulp-babel");
var cssnano = require("gulp-cssnano");
var rename = require("gulp-rename")
var uglify = require("gulp-uglify");
var concat = require("gulp-concat");
var connect = require("gulp-connect");
var cache = require("gulp-cache");
var imagemin = require("gulp-imagemin");
var htmlmin = require('gulp-htmlmin')//html压缩
var bs = require('browser-sync').create();
var sass = require('gulp-sass');
// gulp-util, 打印出js错误信息
var util = require('gulp-util');
// js错误，定位到错误行
var sourcemaps = require('gulp-sourcemaps');

var path = {
    'html': "templates/**/",
    'css': "src/css/**/",
    'js': "src/js/**/",
    'images': "src/images/",
    'css_dist': "dist/css/",
    'js_dist': "dist/js/",
    'images_dist': "dist/images/",
};

//创建html任务
gulp.task("html", async () => {
    gulp.src(path.html + '*.html')
        .pipe(bs.stream())
});
//创建js任务
gulp.task("js", async () => {
    return gulp.src(path.js + '*.js')
        .pipe(babel({
            "presets": [
                "es2015"
            ]
        }))
        .pipe(sourcemaps.init())
        .pipe(uglify().on("error", util.log))
        .pipe(rename({ "suffix": ".min" }))
        .pipe(sourcemaps.write())
        .pipe(gulp.dest(path.js_dist))
        .pipe(bs.stream())
    // .pipe(connect.reload()) //当内容发生改变时， 重新加载。
});
// //创建js-css任务
// gulp.task("jsCss", async () => {
//     return gulp.src(path.js + '*.css')
//         .pipe(sass().on("error", sass.logError))
//         .pipe(cssnano())
//         .pipe(rename({ "suffix": ".min" }))
//         .pipe(gulp.dest(path.js_dist))
//         .pipe(bs.stream())
//     // .pipe(connect.reload()) //当内容发生改变时， 重新加载。
// });
//创建css任务
gulp.task("css", async () => {
    return gulp.src(path.css + '*.css')
        .pipe(sass().on("error", sass.logError))
        .pipe(cssnano())
        .pipe(rename({ "suffix": ".min" }))
        .pipe(gulp.dest(path.css_dist))
        .pipe(bs.stream())
    // .pipe(connect.reload()) //当内容发生改变时， 重新加载。
});
//创建scss任务
gulp.task("scss", async () => {
    return gulp.src(path.css + '*.scss')
        .pipe(sass().on("error", sass.logError))
        .pipe(cssnano())
        .pipe(rename({ "suffix": ".min" }))
        .pipe(gulp.dest(path.css_dist))
        .pipe(bs.stream())
    // .pipe(connect.reload()) //当内容发生改变时， 重新加载。
});


//创建imgaes任务
gulp.task("images", async () => {
    return gulp.src(path.images + '*.*')
        .pipe(cache(imagemin()))
        .pipe(gulp.dest(path.images_dist))
        .pipe(bs.stream())
    // .pipe(connect.reload()) //当内容发生改变时， 重新加载。
});

//创建watch监听任务
gulp.task("watch", async () => {
    gulp.watch(path.html + '*.html', gulp.series('html'));
    gulp.watch(path.css + '*.scss', gulp.series('scss'));
    gulp.watch(path.css + '*.css', gulp.series('css'));
    gulp.watch(path.js + '*.js', gulp.series('js'));
    // gulp.watch(path.js + '*.css', gulp.series('jsCss'));
    gulp.watch(path.images + '*.*', gulp.series('images'));
});

//初始化browser-sync
gulp.task("bs", async () => {
    bs.init({
        "server": {
            "baseDir": "./"
        }
    })
});

//创建默认监听窗口
// gulp.task("default", ['bs', 'watch']);

gulp.task('default', gulp.series(gulp.parallel('html', 'js', 'css', 'scss', 'images', 'bs', 'watch')));
// gulp.task('default',gulp.series(gulp.parallel('html','js','css','images','bs')));